/* ============================================================
   MODERN ENTITY LIST TABLE + FILTER PANEL COMBINED CSS
   ============================================================ */

/* ------------------ TABLE BASE STYLE ------------------ */

.table-scroll-container {
    max-height: 400px;        /* Adjust height as needed */
    overflow-y: auto;         /* Enables vertical scrolling */
   
}

.entitylist .table {
    border-collapse: separate;
    border-spacing: 0 6px;                     /* spacing between rows */
    font-family: "Segoe UI", Arial, sans-serif;
    table-layout: auto !important;             /* dynamic column sizing */
    width: 100% !important;
}

/* Header styling with sticky effect */
.entitylist .table thead th {
    font-size: 11px !important;
    font-weight: 600;
    padding: 6px 10px !important;
    background: #f4f4f6 !important;
    border-bottom: 2px solid #ddd !important;
    vertical-align: top !important;
    white-space: normal !important;            /* allow header wrapping */
    word-wrap: break-word;
    max-width: 250px;

    /* Sticky header */
    position: sticky;
    top: 0;
    z-index: 2;
}

/* Body cell styling */
.entitylist .table tbody td {
    font-size: 13px !important;
    padding: 8px 10px !important;
    vertical-align: top !important;
    background: #ffffff;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    white-space: normal !important;            /* allow wrapping */
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 1px;                            /* magic trick: distributes width based on content */
}

/* Rounded row containers */
.entitylist .table tbody tr td:first-child {
    border-left: 1px solid #eee;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}
.entitylist .table tbody tr td:last-child {
    border-right: 1px solid #eee;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

/* Hover effect */
.entitylist .table tbody tr:hover td {
    background: #f9fafb !important;
}

/* ------------------ FILTER PANEL ------------------ */

/* Whole filter container */
.entitylist .entitylist-filter {
    background: #f5f5f7;
    padding: 8px;
    border-radius: 2px;
    border: 0.5px solid #e0e0e0;
    font-family: "Segoe UI", Arial, sans-serif;
}

/* Filter section titles */
.entitylist .entitylist-filter .facet-title {
    font-size: 11px;
    font-weight: 600;
    margin-bottom: 8px;
    margin-top: 12px;
    color: #333;
}

/* Individual filter rows */
.entitylist .entitylist-filter .facet-item {
    display: flex;
    align-items: flex-start;
    padding: 6px 8px;
    margin-bottom: 8px;
    background: #ffffff;
    border-radius: 8px;
    border: 0.5px solid #e3e3e3;
}

/* Filter text labels */
.entitylist .entitylist-filter .facet-item label {
    font-size: 10px !important;
    margin: 0;
    line-height: 1.3em;
}

/* Checkbox/radio spacing + scaling */
.entitylist .entitylist-filter input[type="checkbox"],
.entitylist .entitylist-filter input[type="radio"] {
    margin-right: 10px !important;
    margin-top: 2px;
    transform: scale(1.1);
}

/* Hover effect */
.entitylist .entitylist-filter .facet-item:hover {
    background: #f9f9f9;
    border-color: #d5d5d5;
}